﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" href="style.css" type="text/css" />
    <script type="text/javascript" src="../js/prototype.js"></script>
    <script type="text/javascript" src="../js/mapstraction.js"></script>
    <script type="text/javascript" src="../js/ObjTree.js"></script>
    <script type="text/javascript" src="../js/tools4gps.js"></script>
</head>
<body>
<form id="form1">
  <div class="twocolumn">
    <input type="radio" name="source" value="0" checked> source: 'wpt' (por defecto)<BR/>
    <input type="radio" name="source" value="1"> source: 'trk'<BR/>
    <input type="checkbox" id="includeStart" value="true" checked /> includeStart: <span id="istag">true</span><BR/>
    <input type="checkbox" id="includeEnd" value="true" checked /> includeEnd: <span id="ietag">true</span>
  </div>
  <div class="twocolumn">
    <input type="radio" name="sourceRef" value="0" checked> sourceRef: 1 (por defecto)<BR/>
    <input type="radio" name="sourceRef" value="1"> sourceRef: 3<BR/>
    <input type="radio" name="sourceRef" value="2"> sourceRef: [4,5,9]
  </div>
  <input type="button" id="apply" value="Aplicar">
</form>
<table id="planner">
  <thead>
    <th class='num'>Num.</th>
    <th class='dist'>Distancia</th>
    <th class='lat'>Latitud</th>
    <th class='lon'>Longitud</th>
    <th class='elev'>Altura</th>
    <th class='elevGain'>Desnivel +</th>
    <th class='elevLoss'>Desnivel -</th>
    <th class='name'>Nombre</th>
  </thead>
  <tbody>
    <tr class="evenrow">
      <td></td>
      <td> Km</td>
    </tr>
    <tr class="oddrow"></tr>
  </tbody>
</table>
<script type="text/javascript">
    GPS.setI18N('es');
    function getValue(n) {
        return (parseInt(Form.getInputs('form1', 'radio', n)
                        .find(function(radio) { return radio.checked; }).value));
    }
    var source = ['wpt', 'trk'];
    var sourceRef = [1, 3, [4,5,9]];
    var parser = new GPS.Parser("gpsdata/070121_itobal-lascuevas.gpx");
    parser.run(function (gpsData) {
        var planner = new GPS.Planner("planner", gpsData);
        $("apply").observe('click', function() {
            $('istag').innerHTML = $F('includeStart') || 'false';
            $('ietag').innerHTML = $F('includeEnd') || 'false';
            planner.setOptions({
                'includeStart': $('istag').innerHTML == 'true',
                'includeEnd': $('ietag').innerHTML == 'true',
                'source': source[getValue('source')],
                'sourceRef': sourceRef[getValue('sourceRef')]
            });
            planner.loadData();
            planner.draw();
        });
    });
</script>
</body>
</html>
